import React from 'react'
import { Text, View } from '@tarojs/components'
import style from './PlanBenefitsCard.module.scss'

interface Props {
  title: string;
  btnText?: string;
  containerClass?: string;
  onClickBtn: () => void
}

const PlanBenefitsCard: React.FC<Props> = ({
  title, btnText, children,
  containerClass, onClickBtn
}) => (
  <View className={`${style.container} ${containerClass}`}>
    <View className={style.header}>
      <View className={style.titleContainer}>
        <Text className={style.titleText}>{title}</Text>
        <View className={style.line} />
      </View>
      {!!btnText && (
      <View className={style.row} onClick={onClickBtn}>
        <Text className={style.btnText}>{btnText}</Text>
      </View>
      )}
    </View>
    {children}
  </View>
)

export default PlanBenefitsCard
